<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" isELIgnored="false" %>
<html>
<head>
    <title>用户修改</title>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/layui/css/layui.css">
</head>
<body>
<%--layui-form  layui的表单样式，添加到form表单上--%>
<form class="layui-form" method="post">
    <%--一个表单项--%>
    <input type="hidden" name="id" value="${users.id}" >
    <div class="layui-form-item">
        <label class="layui-form-label">用户名</label>
        <%--layui-input-inline 行内 block 占整行--%>
        <div class="layui-input-inline">
            <input type="text" name="account" value="${users.account}" readonly autocomplete="off" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">真实姓名</label>
        <%--layui-input-inline 行内 block 占整行--%>
        <div class="layui-input-inline">
            <input type="text" name="real_name" value="${users.real_name}" placeholder="请输入真实姓名" autocomplete="off" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">手机号码</label>
        <%--layui-input-inline 行内 block 占整行--%>
        <div class="layui-input-inline">
            <input type="text" name="phone_number" value="${users.phone_number}" placeholder="请输入手机号码" autocomplete="off"
                   class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">邮箱</label>
        <%--layui-input-inline 行内 block 占整行--%>
        <div class="layui-input-inline">
            <input type="text" name="email" value="${users.email}" placeholder="请输入邮箱" autocomplete="off"
                   class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">职位</label>
        <div class="layui-input-inline">
            <select name="role_id">
                <c:forEach items="${sessionScope.role}" var="role">
                    <option value="${role.id}">${role.name}</option>
                </c:forEach>
            </select>
        </div>
    </div>
    <div class="layui-form-item" >
        <%--lay-submit 标识该按钮可以提交表单--%>
        <input type="button" style="margin-left: 100px" lay-filter="update" lay-submit class="layui-btn" value="提交">
    </div>
</form>
<%--引入js--%>
<script src="${pageContext.request.contextPath}/static/layui/layui.js"></script>
<script>
    //layui引入特定模块的方式
    layui.use(['layer', 'form','jquery'], function () {
        var layer = layui.layer//layer 弹窗对象
            , form = layui.form;//表单对象
        var $=layui.$;

        layer.msg('Hello World');
        //表单提交监听
        form.on("submit(update)",function (data) {
            //发起异步请求，新增 data.field 表单数据
            $.post("/users/update",data.field,function (result) {
                if(result.code==0){
                    layer.msg("修改成功！");
                    //刷新父框框口内容
                    parent.layui.table.reload("roleTable"
                        //     , {
                        //     page:{
                        //         curr:1
                        //     }
                        // }
                    )
                    //关闭弹出
                    var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
                    parent.layer.close(index); //再执行关闭
                }
            },"json");
            return false;
        })
    });
</script>
</body>
</html>

